<%--
  Created by IntelliJ IDEA.
  User: s1xgod
  Date: 2022/9/23
  Time: 22:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>edit</title>
    <link rel="shortcut icon" href="/res/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="../css/register.css">
    <script src="../js/jquery-3.6.1.min.js"></script>
    <script src="../layui/layui.js"></script>
    <%--    该页面不是用子窗口打开的，跳转到登录界面--%>
    <script>
        if (window == top) {
            location.href = "/res/user/login.jsp";
        }
    </script>
</head>
<body>
<div>
    <div id="文字标题">编辑</div>
    <br>
    <form class="layui-form layui-form-pane" action="" method="post">
        <div id="login-name-check" style="position: absolute;top: 45px;left: 200px;color: red"></div>
        <br>
        <div class=" layui-form-item">
            <label class="layui-form-label">登录名</label>
            <div class="layui-input-inline">
                <input id="login-name" type="text" name="loginName" required lay-verify="required|okLoginName"
                       placeholder="请输入登录名"
                       autocomplete="off"
                       class="layui-input">
            </div>

        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-inline">
                <input id="user-name" type="text" name="userName" required lay-verify="required|okUserName"
                       placeholder="请输入用户名"
                       autocomplete="off"
                       class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux"></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">验证码</label>

            <div class="layui-input-inline" style="width: 100px">
                <input type="text" name="code" required lay-verify="required" placeholder="请输入验证码"
                       autocomplete="off" class="layui-input">
            </div>
            <img id='codeImg' src="/common/code?type=2">
            <div class="layui-form-mid layui-word-aux"></div>
        </div>
        <br>
        <div class="layui-form-item submit-btn">
            <div class="layui-input-inline">
                <button class="layui-btn" lay-submit lay-filter="formDemo">确认</button>
                <span style="margin-left: 20px;margin-right: 20px"></span>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>


</body>
<script>
    // 获取父类控件该行的数据，用于编辑数据的回显
    $("#login-name").val(window.parent.loginName1)
    $("#user-name").val(window.parent.userName1)
    layui.use('form', function () {
        var form = layui.form;
        var $ = layui.jquery;
        var flag = false;
        $("#login-name").blur(function () {
            $.get("/user/checkLoginName", {
                "loginname": $("#login-name").val(),
            }, function (data) {
                if (data >= "1") {
                    $("#login-name-check").text("登录名已被使用")
                    flag = true;
                } else {
                    $("#login-name-check").text("")
                    flag = false;
                }
            })

        })
        // 验证码点击刷新,编辑界面的code类型为2
        $("#codeImg").click(function () {
            $("#codeImg").attr("src", "/common/code/?type=2&time=" + new Date().getTime());
        })

        form.verify({
            okLoginName: [
                /^\w{3,10}$/
                , '请输入长度为3-10的英文/数字/下划线'
            ],
            okUserName: [
                /^[a-zA-Z0-9\u4E00-\u9FA5]{3,10}$/
                , '请输入长度为3-10的英文/数字/汉字'
            ],
        })


        //更新该行用户
        form.on('submit(formDemo)', function (data) {
            if (flag) {
                layer.msg("登录名已被使用");
                return false;
            }
            $.post("/user/update", {
                "id": window.parent.id1, // 获取父级控件list.jsp的变量id1
                "loginName": data.field.loginName,
                "userName": data.field.userName
            }, function (returnData) {
                // 后台返回0表示成功
                if (returnData == "0") {
                    layer.msg("操作成功");
                    parent.layer.closeAll();
                    // 修改父级控件list.jsp的change标志，让其更新数据表格
                    window.parent.updateData();
                } else {
                    layer.msg("服务器繁忙，操作失败");
                }
            })
            return false;
        });

    });
</script>
</html>
